<div class="td-patient-me-appointment-record">
    <mt-header fixed title="预约记录">
        <router-link to="tdPatientMe" slot="left">
            <mt-button icon="back"></mt-button>
        </router-link>
    </mt-header>

    <mt-navbar v-model="selected" :fixed="true">
        <mt-tab-item id="-1" @click.native="GetAppointmentRecordList">全部</mt-tab-item>
        <mt-tab-item id="0" @click.native="GetAppointmentRecordList">待付款
            <!--未支付-->
        </mt-tab-item>
        <mt-tab-item id="1" @click.native="GetAppointmentRecordList">已完成
            <!--支付成功-->
        </mt-tab-item>
        <mt-tab-item id="2" @click.native="GetAppointmentRecordList">已取消
            <!--支付失败-->
        </mt-tab-item>
        <mt-tab-item id="3" @click.native="GetAppointmentRecordList">退款中
            <!--退款中-->
        </mt-tab-item>
        <mt-tab-item id="4" @click.native="GetAppointmentRecordList">已退款
            <!--已退款-->
        </mt-tab-item>
    </mt-navbar>

    <div class="list">
        <div class="item" v-for="(item,index) in appointmentRecordList" :key="index">
            <h2>{{utils$.convertData(item.CreateTime,3)}}<span>￥{{utils$.subTransfer(item.ItemPrice)}}</span></h2>
            <div>订单号：{{item.OrderNumber}}
                <el-tag v-if="item.OrderStatus===0" type="warning">未支付</el-tag>
                <el-tag v-if="item.OrderStatus===1" type="success">支付成功</el-tag>
                <el-tag v-if="item.OrderStatus===2" type="info">支付失败</el-tag>
                <el-tag v-if="item.OrderStatus===3" type="danger">退款中</el-tag>
                <el-tag v-if="item.OrderStatus===4">已退款</el-tag>
            </div>
            <div>预约项目：{{item.AppointmentItemName}}</div>
            <div>预约时间：{{item.AppointmentDate.split('T')[0]}} <label v-if="item.TimeType===0">08:30~12:00</label><label v-if="item.TimeType===1">13:00~16:30</label><label v-if="item.TimeType===2">18:30~21:30</label></div>
            <div>预约医师：{{item.DoctorName}}</div>
            <div>预约医院：{{item.HospitalName}}</div>
            <div>病例所在地：{{item.RecordHospitalName}}</div>
            <div>是否怀孕：{{item.IsPregnancy===0?'否':'是'}}</div>
            <div>支付平台：<label v-if="item.PayPlatform===0">微信</label><label v-if="item.PayPlatform===1">支付宝</label><label v-if="item.PayPlatform===2">添丁</label></div>
            <div>支付方式：<label v-if="item.PayType===0">JsApiPay</label><label v-if="item.PayType===1">NativePay</label><label v-if="item.PayType===2">APPPay</label><label v-if="item.PayType===3">POS刷卡</label><label v-if="item.PayType===4">支付宝转账</label>
                <label v-if="item.PayType===5">现金支付</label>
            </div>
        </div>
    </div>

    <div class="tip" v-if="appointmentRecordList.length===0">您没有相关订单</div>
</div>